
<template>
  <div>
    <transition name="LtoR">
      <div class="loginBox absolute fixedCenter" style="height:420px;" v-show="whoShow==2">
        <Icon type="ios-arrow-back" class="absolute f_26 cCCC textLink" @click="sendFa(1)" style="top:10px;left:0;" v-show="!$app.judgeData(unionid)"/>
        <Logo title="短信登录"/>


        <Input type="text"  placeholder="请输入手机号" v-model="mobile"  ref="mobile" class="marginB20 " clearable size="large"	>
          <!-- <Icon type="ios-call" slot="prefix" /> -->
        </Input>
        <Row class=" marginB20 " :gutter="20">
          <Col span="16">
            <Input type="text"  placeholder="图形验证码" v-model="captcha" ref="captcha"  clearable size="large">
              <!-- <Icon type="ios-options" slot="prefix" /> -->
            </Input>
          </Col>
          <Col span="8">
            <img :src="tchaObj.img" class="width100 pointer" height="36" @click="$parent.tchaFun">
          </Col>
        </Row>
        <Row class=" marginB20 " :gutter="20">
          <Col span="16">
            <Input type="number"  placeholder="短信验证码" v-model="code" ref="code"  clearable size="large"
              onKeypress="return (/[\d]/.test(String.fromCharCode(event.keyCode)))"
            >
              <!-- <Icon type="ios-chatboxes" slot="prefix" /> -->
            </Input>
          </Col>
          <Col span="8">
          <!-- button 倒计时函数，要用jq处理，原因细说 -->
            <Button type="primary" size="large" long @click="goCodeFun"  :disabled="btnDisabled" id="aDom"
          >获取验证码</Button>
          </Col>
        </Row>
        
        <Button type="primary"  class="btnGo" @click="goFun" size="large" long >登 录</Button>
      </div>
    </transition>
  </div>
</template>



<script>
import Logo from './_logo';//logo
export default {
  components: {
    Logo
  },
  data () {
    let {
      $route:{
        query:{
          unionid
        }
      }
    }=this;


    let data={
      mobile:'',


      captcha:'',//图形 验证码
      code:'',//手机 验证码

      // 获取验证码按钮
      btnDisabled:false,
      unionid//微信绑定
      
    };
    return data;
  },
  //父=》子，接收父亲的值； 1账号密码/2手机短信/3忘记密码/4新用户注册
  props:['whoShow','tchaObj'],
  mounted(){},
  created(){
    let {unionid:unionidObj}=this;
    if($app.judgeData(unionidObj)){
      this.sendFa(2);
      let {
        type,
        unionid,
        api_token
      }=JSON.parse(unionidObj);

      if(type=='register'){
        // this.$Message.info({content:'您的微信未绑定服务猫，请短信登录'});
        $app.toast('您的微信未绑定服务猫，请短信登录',true,()=>{},3000)
      }

    }
  },
  methods: {
    sendFa(num){
      //自定义方法往父传值
      this.$emit('getChildData',num);
    },
    goCodeFun(){
      let that=this;
      $app.loginGetCodeFun(that,2,'aDom');//1注册,2登录,3修改密码,4合伙人认证,5绑定邮箱
    },
    //提交
    goFun () {
      let that=this;
      let {
        mobile,code,
        $route:{
          query:{
            globalUrl
          }
        }
      }=that;
      if(!$app.telCheck(mobile)){
        that.$Message.error({content:'请输入正确的手机格式，勿含空格等特殊字符'});
        that.$refs['mobile'].focus();
      }else if(!$app.judgeData(code)){
        that.$Message.error({content:'验证码不能为空'});
        that.$refs['code'].focus();
      }else{
        let {unionid:unionidObj}=this;
        let unionid='';
        if($app.judgeData(unionidObj)){
          unionid=(JSON.parse(unionidObj).unionid);
        }else{
          unionid='';
        }

        $ajax.mobileLogin(mobile,code,unionid,that,resData=>{
			    $app.saveToken(globalUrl,resData,false,true);//存token
        });

        
      }
    }
  }
}
</script>

<style>

</style>
